<template>
	<view class="login_box">
		<view class="text_login">
			<!-- logo -->
			<image class="login_logo"  src="../../static/logo/orange.png" alt="" />
			
			<!-- 表单区域 -->
			<view class="login_phone">
				<text>手机号</text>
				<input v-model="userPhone" type="text"  maxlength="11" />
			</view>
			<view class="login_code">
				<text>验证码</text>
				<input type="text"  maxlength="4" v-model="userCode" />
				<view hover-class="touchOpacity"  @click="sendSms">{{sendStr}}</view>
			</view>
			
			<!-- 登录按钮 -->
			<view class="login_but" hover-class="touchOpacity" @click="login">
				<text space="ensp">登    录</text> 
			</view>
		</view>
	</view>
</template>

<script>

	export default {
		data() {
			return {
				userPhone:"",
				userCode:"",
				sendStr:"获取验证码",
				buffer:true
			}
		},
		methods: {
			//短信登录
			login(){
				let phone =this.userPhone;
				let code  =this.userCode;		
				let {value,time} =uni.getStorageSync("code")
				
				if(!/^1[3456789]\d{9}/.test(phone)){
					this.$tool.tip("手机号格式有误");return false;
				}
				if(new Date().getTime()-time>1000000000000){
					this.$tool.tip("验证码已过期");return false;
				}					
				if(code != value){
					this.$tool.tip("验证码输入有误");return false;
				}
				this.$http({
					url:"smslogin",
					method:"post",
					data:{phone}
				}).then(res=>{
					//储存用户信息
					uni.setStorageSync("userInfo",res.list)
					uni.setStorageSync("token",res.list)
					this.$tool.tip("登陆成功",'success')
					setTimeout(()=>{
						uni.switchTab({
							url:"../user/user"
					})
					},500)
					
				})
			},
			sendSms(){
		if(this.buffer){
			let phone=this.userPhone
				if(!/^1[3456789]\d{9}/.test(phone)){
					this.$tool.tip("手机号格式有误");return false;
				}
				//执行提交
				this.$http({
					url:"sms",
					data:{phone}
				}).then(res=>{
					this.buffer=false
					console.log(res);
					//将验证码存储到本地后期校验 time过期
					uni.setStorageSync("code",{value:res.list.code,time:new Date().getTime()})
					//处理倒计时
					let n=10;
					let time =setInterval(()=>{
						n--;
						this.sendStr=n+"s发送"
						if(n<0){
							clearInterval(time);
							this.sendStr="获取验证码"
							let n =10;
							this.buffer=true
						}
					},1000)
				})
		}else{
			this.$tool.tip("稍后重试")
		}
			}
		}
}
</script>

<style>
	/* 引入样式 */
	@import url("@/static/css/textlogin.css");
</style>
